<template>
	<view class='page_cont'>
		<view class='teach_desc' @click="nav_user_dom()">
			<view class='name_wrap' v-if="resumeInfo.accountProfile">
				<scroll-view class='indesscroll name' scroll-with-animation="true" scroll-x="true">{{resumeInfo.accountProfile.nickName}}</scroll-view>
				<view class='point'>{{resumeInfo.accountProfile.birthday==null?'':computedAge(resumeInfo.accountProfile.birthday)+'岁 ·'}} {{resumeInfo.accountProfile.sex===1?'男':'女'}} · {{resumeInfo.accountProfile.educationName==''?'':resumeInfo.accountProfile.educationName}}  {{joinTime}}</view>
			</view>
			<view class="img_wrap" v-if="resumeInfo.accountProfile">
				<image class='avatar' :src="resumeInfo.accountProfile.avatar"></image>
				<view class='text'>ID:{{resumeInfo.accountProfile.userId}}</view>
			</view>
		</view>
		<view class='job_inten' @click="nav_object()">
			<view class='title'>求职意向</view>
			<view class='text' v-if="resumeInfo.jobIntention">{{resumeInfo.jobIntention.jobWantedName}}</view>
			<image class='icon' src="/static/icon43.png"></image>
		</view>
		<view class='job_want' v-if="resumeInfo.jobIntention">
			<view class='name_box'>
				<view class='title'>{{resumeInfo.jobIntention.positionChildName||resumeInfo.jobIntention.positionName}}</view>
				<view class='point' v-if="resumeInfo.jobIntention">
					<view class='item'>{{resumeInfo.jobIntention.hierarchyName}}</view>
					<view class='item'>{{resumeInfo.jobIntention.teacherModeName}}</view>
				</view>
			</view>
			<view class='desc_wrap'>
				<view class='desc' v-if="resumeInfo.jobIntention">
					<view class='item'>
						<image class='icon' src="/static/icon28.png"></image>
						<view class='text' v-if="resumeInfo.jobIntention.salaryMin==null || resumeInfo.jobIntention.salaryMin==0">面议</view>
						<view class='text' v-else>{{resumeInfo.jobIntention.salaryMin/1000}}~{{resumeInfo.jobIntention.salaryMax/1000}}k/月</view>
					</view>
					<view class='item'>
						<image class='icon' src="/static/icon29.png"></image>
						<view class='text'>{{resumeInfo.jobIntention.workNature===2?'兼职':'全职'}}</view>
					</view>
					<view class='item' v-if="resumeInfo.jobIntention.startTimeName!==''">
						<image class='icon' src="/static/icon30.png"></image>
						<view class='text'>{{resumeInfo.jobIntention.startTimeName}}</view>
					</view>
				</view>
				<view class='city' v-if="resumeInfo.jobIntention.intentionProvinceName!==''">
					<image class='icon' src="/static/icon31.png"></image>
					<view class='text'>
						<scroll-view class='scroll' scroll-x="true" scroll-with-animation="true">
							<view class='label'>
								<text class="label_list" v-for="(item,index) in cityInfo" :key='index'>{{item}}</text>
							</view>
						</scroll-view>
					</view>
				</view>
			</view>
			<view class='welf' v-if="resumeInfo.jobIntention.welfareNames!==''">
				<view class='title'>期待福利</view>
				<view class='job_label_box'>
					<scroll-view class='scroll_label' scroll-with-animation="true" scroll-x="true">
						<view class='label' v-for="(item,index) in welfareList" :key='index'>{{item}}</view>
					</scroll-view>
				</view>
			</view>
		</view>
		<view class='view_wrap'>
			<view class='title_wrap' @click="nav_educational(-1)">
				<view class='title'>教育经历<view class='line'></view>
				</view>
				<image class='icon' src="/static/icon47.png"></image>
			</view>
			<view class='view_list'>
				<view class='item' @click="nav_educational(item.id)" v-for="(item,index) in resumeInfo.experiences" :key='index'>
					<view class='name_box'>
						<view class='name'>{{item.schoolName}}</view>
						<view class='time'>{{format(item.admissionTime)}}-{{format(item.graduationTime)}}</view>
						<image class='iconTime' src="/static/icon43.png"></image>
					</view>
					<view class="text">{{item.educationName}}-{{item.majorName}} {{item.isFullTime===1?'全日制':'非全日制'}}
						{{item.majorType===1?'师范':'非师范'}}</view>
				</view>
			</view>
		</view>
		<view class='view_wrap'>
			<view class='title_wrap' @click="nav_exper(-1)">
				<view class='title'>工作经历<view class='line'></view>
				</view>
				<image class='icon' src="/static/icon47.png"></image>
			</view>
			<view class='view_list'>
				<view class='item' @click="nav_exper(item.id)" v-for="(item,index) in resumeInfo.works" :key='index'>
					<view class='name_box'>
						<view class='name'>{{item.businessName}}</view>
						<view class='time'>{{format(item.entryTime)}}-{{format(item.quitTime)}}</view>
					</view>
					<view class="text">{{item.positionName}}</view>
					<view class='desc'>
						<!-- <view class='desc_item'>{{item.workDescribe}}</view> -->
						<rich-text class='desc_item' :nodes="item.workDescribe"></rich-text>
					</view>
				</view>
			</view>
		</view>
		<view class='view_wrap no_border'>
			<view class='title_wrap' @click="nav_credent()">
				<view class='title'>证书管理<view class='line'></view>
				</view>
				<image class='icon' src="/static/icon47.png"></image>
			</view>
			<view class='scroll_box'>
				<scroll-view class='scroll' scroll-x="true" scroll-with-animation="true">
					<view class='item' v-for="(item,index) in resumeInfo.certificates" :key='index'>
						<view class='credent'>
							<scroll-view class='name' scroll-x="true" scroll-with-animation="true">{{item.name}}</scroll-view>
							<view class='time'>{{format(item.time)}}</view>
						</view>
						<view class="img_box">
							<image class='img' :src="item.url" mode="aspectFill"></image>
							<image class='icon' src="/static/icon48.png" @click="del_credent(item.id)"></image>
						</view>
					</view>
				</scroll-view>
			</view>
		</view>
		<view class="mask" @touchmove.stop.prevent="moveHandle" v-show="show_pop">
			<view class='pop'>
				<view class='point'>确定删除证书</view>
				<view class='btn_wrap'>
					<view class='btn' @click="show_pop=false">取消</view>
					<view class='btn' @click="confirm_del()">确定</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import resume from "../../api/myResume.js"
	import util from "../../utils/util.js"
	export default {
		data() {
			return {
				job_object: '',
				show_pop: false,
				id: '',
				resumeInfo: {},
				welfareList: [],
				delId: '',
				intentionProvinceName: [],
				intentionCityName: [],
				intentionRegionName: [],
				cityInfo: [],
				joinTime:'',
				screening:false
			}
		},
		onShow() {
			const value = uni.getStorageSync('userinfo');
			this.getResumeInfo(value.id)
			this.id=value.id;
			if(this.screening){
				this.screening=false
				this.getResumeInfo(value.id)
			}
		},
		onLoad() {},
		methods: {
			//
			nav_user_dom(){
				uni.navigateTo({
					url: '../myDom/myDom?id='+this.id
				})
			},
			// 获取登录用户简历信息
			getResumeInfo(id) {
				resume.get_resume_info({
					id
				}).then(res => {
					this.resumeInfo = res.data.data
					// console.log(res.data.data);
					// this.resumeInfo.works=[]
					let workarr =[]
					res.data.data.works.forEach(item=>{
						item.workDescribe=item.workDescribe.replace(/\n/g, "<br>")
						workarr.push(item)
					})
					this.resumeInfo.works=workarr
					if(res.data.data.jobIntention){
						this.welfareList = res.data.data.jobIntention.welfareNames.split(',')
						this.intentionProvinceName = res.data.data.jobIntention.intentionProvinceName.split(',')
						this.intentionCityName = res.data.data.jobIntention.intentionCityName.split(',')
						if(res.data.data.jobIntention.intentionRegionName!==null){
							this.intentionRegionName = res.data.data.jobIntention.intentionRegionName.split(',')
						}
					}
					let arr = []
					this.cityInfo=[]
					this.intentionProvinceName.forEach((province, provinceIndex) => {
						let obj = {}
						if(province==this.intentionCityName[provinceIndex]){
							obj.name=province
						}else{
							obj.name=province + '-' + this.intentionCityName[provinceIndex]
						}
						if(this.intentionRegionName[provinceIndex]!=0&&this.intentionRegionName[provinceIndex]){
							obj.name=obj.name+'-'+this.intentionRegionName[provinceIndex]
						}
						// obj.name = province + '-' + this.intentionCityName[provinceIndex] + '-' + this.intentionRegionName[
						// 	provinceIndex]
						arr.push(obj)
					})
					arr.forEach(item=>{
						if(item['name'].includes('-0')){
							this.cityInfo.push(item['name'].slice(0,item['name'].length-2))
						}else{
							this.cityInfo.push(item['name'])
						}
					})
					const date=new Date()
					const time=new Date(res.data.data.accountProfile.joinWorkTime)
					const yearNow=date.getFullYear()
					const workYear=time.getFullYear()
					this.joinTime= yearNow - workYear<=0 ? '1年内工作经验': yearNow - workYear + '年工作经验'
				})
			},
			// 求职意向
			nav_object() {
				uni.navigateTo({
					url: '../../pages/jobObject/jobObject?type=2'
				})
			},
			// 教育经历
			nav_educational(id) {
				uni.navigateTo({
					url: "../educational/educational?id=" + id
				})
			},
			// 工作经历
			nav_exper(id) {
				if (id === -1) {
					uni.navigateTo({
						url: '../jobExper/jobExper'
					})
				} else {
					uni.navigateTo({
						url: `../jobExper/jobExper?id=${id}`
					})
				}
			},
			// 证书管理
			nav_credent() {
				uni.navigateTo({
					url: '../credentials/credentials'
				})
			},
			// 禁止触摸穿透
			moveHandle() {},
			// 关闭弹框
			close_pop() {
				this.show_pop = false;
			},
			//删除证书
			del_credent(id) {
				this.show_pop = true
				this.delId = id
			},
			// 确定删除
			confirm_del() {
				resume.del_teacher_certificate({
					id: this.delId
				}).then(res => {
					// console.log(res);
					if (res.data.code === '200') {
						util.page_show_toast('删除成功', 3000)
						this.show_pop = false
						this.getResumeInfo(this.id)
					}
				})
			},
			// 时间处理
			add0(m) {
				return m < 10 ? '0' + m : m
			},
			format(shijianchuo) {
				var time = new Date(shijianchuo);
				var y = time.getFullYear();
				var m = time.getMonth() + 1;
				// var d = time.getDate();
				// return y + '-' + this.add0(m) + '-' + this.add0(d);
				return y + '.' + this.add0(m);
			},
			computedAge(timeer){
				// console.log(timeer);
				const nowTime = new Date().getTime() + ''
				const subTime = nowTime.substring(0, nowTime.length - 3)
				return Math.floor(((+subTime - timeer/1000) / 31536000000) * 1000)
			},
			 // 计算年龄/工作年限
			 computedAgeOrWorkTime(timeer, boolean = true) {
				const nowTime = new Date().getTime() + ''
				// 一年毫秒数(365 * 86400000 = 31536000000)
				const subTime = nowTime.substring(0, nowTime.length - 3)
				if (boolean) {
				  return Math.floor(((+subTime - timeer) / 31536000000) * 1000)
				} else {
				  return Math.ceil(((+subTime - timeer) / 31536000000) * 1000) 
				}
			 },
		},
	}
</script>

<style lang="scss">
	.page_cont {
		padding: 16rpx 32rpx 0 32rpx;

		.teach_desc {
			padding-bottom: 40rpx;
			border-bottom: 2rpx solid #F7F9FB;
			display: flex;
			flex-direction: row;

			.name_wrap {
				flex: 1;
				margin-right: 16rpx;
				.indesscroll{
					max-width: 335rpx;
					overflow: hidden;
					white-space:nowrap;
				}		
				.name {
					text-align: left;
					height: 66rpx;
					font-size: 48rpx;
					font-weight: 600;
					line-height: 66rpx;
					color: #3F4A58;
					margin-bottom: 10rpx;
				}

				.point {
					text-align: left;
					height: 40rpx;
					font-size: 28rpx;
					font-weight: 400;
					line-height: 40rpx;
					color: #798594;
				}
			}

			.img_wrap {
				width: 200rpx;
				.avatar {
					width: 88rpx;
					height: 88rpx;
					margin-left: 56rpx;
					border-radius: 50%;
					margin-bottom: 6rpx;
				}

				.text {
					text-align: center;
					height: 22rpx;
					font-size: 16rpx;
					font-weight: 400;
					line-height: 22rpx;
					color: #798594;
					overflow: hidden;
				}
			}
		}

		.job_inten {
			padding: 40rpx 0;
			display: flex;
			flex-direction: row;
			align-items: center;
			border-bottom: 2rpx solid #F7F9FB;

			.title {
				flex: 1;
				text-align: left;
				height: 42rpx;
				font-size: 30rpx;
				font-weight: 600;
				line-height: 42rpx;
				color: #3F4A58;
			}

			.text {
				height: 34rpx;
				font-size: 24rpx;
				font-weight: 400;
				line-height: 34rpx;
				color: #798594;
				margin-right: 8rpx;
			}

			.icon {
				width: 24rpx;
				height: 24rpx;
			}
		}

		.job_want {
			padding: 40rpx 0 48rpx 0;
			border-bottom: 2rpx solid #F7F9FB;

			.name_box {
				display: flex;
				flex-direction: row;
				align-items: center;

				.title {
					flex: 1;
					text-align: left;
					height: 42rpx;
					font-size: 30rpx;
					font-weight: 600;
					line-height: 42rpx;
					color: #3F4A58;
				}

				.point {
					display: flex;
					flex-direction: row;

					.item {
						padding: 0 16rpx;
						height: 42rpx;
						line-height: 42rpx;
						background: rgba(91, 144, 255, 0.11);
						border-radius: 8rpx;
						font-size: 24rpx;
						font-weight: 400;
						color: #5B90FF;
						margin-right: 16rpx;
					}
				}
			}

			.desc_wrap {
				margin: 40rpx 0 30rpx 0;

				.desc {
					display: flex;
					flex-direction: row;
					margin-bottom: 24rpx;

					.item {
						margin-right: 64rpx;
						display: flex;
						flex-direction: row;
						align-items: center;

						.icon {
							width: 40rpx;
							height: 40rpx;
							margin-right: 8rpx;
						}

						.text {
							height: 40rpx;
							font-size: 28rpx;
							font-weight: 400;
							line-height: 40rpx;
							color: #798594;
						}
					}
				}

				.city {
					display: flex;
					flex-direction: row;
					align-items: center;

					.icon {
						width: 40rpx;
						height: 40rpx;
						margin-right: 8rpx;
					}

					.text {
						width: 100%;
						display: flex;
						overflow: hidden;
						white-space: nowrap;
						height: 40rpx;
						font-size: 28rpx;
						font-weight: 400;
						line-height: 40rpx;
						color: #798594;
						.label_list {
							margin-right: 25rpx;
						}
					}
				}
			}

			.welf {
				width: 100%;

				.title {
					text-align: left;
					height: 34rpx;
					font-size: 24rpx;
					font-weight: 400;
					line-height: 34rpx;
					color: rgba(63, 74, 88, 0.44);
					margin-bottom: 16rpx;
				}

				.job_label_box {
					width: 100%;
					overflow: hidden;
					white-space: nowrap;
					height: 48rpx;

					.scroll_label {
						width: 100%;
						height: 60rpx;
						line-height: 40rpx;
						overflow: hidden;

						.label {
							display: inline-block;
							background: #F6F7F9;
							height: 48rpx;
							line-height: 48rpx;
							padding: 0 16rpx;
							font-size: 24rpx;
							font-weight: 400;
							color: rgba(146, 155, 167, 1);
							border-radius: 8rpx;
							margin-right: 16rpx;
						}
					}
				}
			}
		}

		.view_wrap {
			padding: 48rpx 0;
			border-bottom: 2rpx solid #F7F9FB;

			.title_wrap {
				display: flex;
				flex-direction: row;
				align-items: center;
				margin-bottom: 40rpx;

				.title {
					flex: 1;
					position: relative;
					height: 50rpx;
					font-size: 36rpx;
					font-weight: 600;
					line-height: 50rpx;
					color: #3F4A58;

					.line {
						position: absolute;
						top: 10rpx;
						left: -32rpx;
						width: 8rpx;
						height: 32rpx;
						background: #5B90FF;
					}
				}

				.icon {
					width: 50rpx;
					height: 50rpx;
				}
			}

			.view_list {
				width: 100%;

				.item {
					width: 100%;
					margin-bottom: 40rpx;

					&:last-child {
						margin-bottom: 0;
					}

					.name_box {
						display: flex;
						flex-direction: row;
						align-items: center;
						margin-bottom: 6rpx;
						.iconTime{
							width: 20rpx;
							height: 20rpx;
							margin-left: 6rpx;
						}

						.name {
							flex: 1;
							font-size: 30rpx;
							font-weight: 600;
							line-height: 42rpx;
							color: #3F4A58;
							overflow: hidden;
							text-overflow: ellipsis;
							display: -webkit-box;
							-webkit-line-clamp: 2;
							-webkit-box-orient: vertical;
							margin-right: 16rpx;
						}

						.time {
							margin-top: 4rpx;
							height: 34rpx;
							font-size: 24rpx;
							font-weight: 400;
							line-height: 34rpx;
							color: rgba(121, 133, 148, 0.5);
						}
					}

					.text {
						height: 34rpx;
						font-size: 24rpx;
						font-weight: 400;
						line-height: 34rpx;
						color: #929BA7;
					}

					.desc {
						margin-top: 24rpx;

						.desc_item {
							font-size: 28rpx;
							font-weight: 400;
							line-height: 48rpx;
							color: #798594;
						}
					}
				}
			}

			.scroll_box {
				width: 100%;
				overflow: hidden;
				white-space: nowrap;

				.scroll {
					width: 100%;
					overflow: hidden;

					.item {
						display: inline-block;
						margin-right: 48rpx;

						&:last-child {
							margin-right: 0;
						}

						.credent {
							width: 100%;
							margin-bottom: 24rpx;

							.name {
								width: 360rpx;
								height: 42rpx;
								font-size: 30rpx;
								font-weight: 600;
								line-height: 42rpx;
								color: #3F4A58;
								display: inline-block;
								overflow: hidden;
								white-space: nowrap;
								margin-bottom: 4rpx;
							}

							.time {
								text-align: left;
								height: 34rpx;
								font-size: 24rpx;
								font-weight: 400;
								line-height: 34rpx;
								color: #929BA7;
							}
						}

						.img_box {
							width: 360rpx;
							position: relative;

							.img {
								width: 360rpx;
								height: 268rpx;
								border-radius: 16rpx;
							}

							.icon {
								position: absolute;
								top: 12rpx;
								right: 20rpx;
								width: 32rpx;
								height: 32rpx;
							}
						}
					}
				}
			}
		}

		.no_border {
			border-bottom: 0;
		}

		.pop {
			width: 500rpx;
			/* #ifdef MP-WEIXIN */
			margin: 360rpx auto 0 auto;
			/* #endif */
			/* #ifdef H5 */
			margin: 500rpx auto 0 auto;
			/* #endif */
			/* #ifdef APP-PLUS */
			margin: 360rpx auto 0 auto;
			/* #endif */
			background: #fff;
			border-radius: 16rpx;
			padding: 76rpx 48rpx 52rpx 48rpx;

			.point {
				text-align: center;
				height: 50rpx;
				font-size: 36rpx;
				font-weight: 600;
				line-height: 50rpx;
				color: #3F4A58;
				margin-bottom: 64rpx;
			}

			.btn_wrap {
				width: 100%;
				display: flex;
				flex-direction: row;

				.btn {
					flex: 1;
					height: 88rpx;
					text-align: center;
					line-height: 88rpx;
					font-size: 30rpx;
					font-weight: 400;
					border-radius: 16rpx;

					&:first-child {
						background: rgba(146, 155, 167, 0.15);
						color: #798594;
						margin-right: 38rpx;
					}

					&:last-child {
						background: #5B90FF;
						color: #fff;
					}
				}
			}
		}
	}
</style>
